<template>
	<view class="topComSty">
		<!-- #ifdef H5 || APP-PLUS-->
		<view>
			<view class="box-bg">
			</view>
			<view class="nav_wrap" v-if="userName!=''">
				<view v-if="userName!==''" class="iconfont icon-zuojiantou"
					style="color:white;font-size: 54rpx; position: absolute; top: 140rpx; left: 3%;" @click="getBack()">
				</view>
				<view v-else class="iconfont icon-shouye-shouye"
					style="color:white;font-size: 32upx; position: absolute; top: 140rpx; left: 3%;">
				</view>

				<!-- #ifdef APP-PLUS  -->
				<view v-if="userName!=''" class="iconfont icon-zuojiantou" style="color:#0000EE;font-size: 36rpx;">
				</view>
				<view v-else class=" iconfont icon-shouye-shouye" style="color:white;font-size: 32upx;">
				</view>
				<!--#endif -->

				<view class="topIndexFlex">
					<view class="iconfont icon-shouye-shouye"
						style="font-size: 38rpx;margin-right:50rpx;margin-left: 60rpx;" v-if="topName=='首页'"></view>
					{{topName}}
				</view>
				<!-- 班级 -->
				<view @click="skipFun()" style="font-size: 28rpx; margin-left: 560rpx;"
					v-if="classId&&roleName=='部门经理'">
					{{titleFont}}
					<span class="iconfont icon-xiajiantou" style="font-size: 28rpx;"></span>
				</view>
				<!-- 宿舍 -->
				<view @click="skipFun()" v-else-if="buildingNo&&(userName=='宿管老师'||userName=='部门经理'||userName=='超级管理员')"
					style="font-size: 28rpx; margin-left: 560rpx; position: relative; top: 48rpx;">{{buildFont}}
					<span class="iconfont icon-xiajiantou" style="font-size: 28rpx;"></span>
				</view>
				<!-- 其他 -->
				<view @click="skipFun()" v-else style="font-size: 28rpx;margin-left: 560rpx;">
					<view style="position: relative; top: -28rpx;">
						<span>{{userName}}</span>
						<span class="iconfont icon-xiajiantou" style="font-size: 28rpx;"></span>
					</view>
				</view>
				<!-- <view class="logout"></view> -->
				<!-- <text  >退出</text> -->
			</view>
			<view v-else class="nav_wrap">
				<view style="color:white;font-size: 38rpx;margin-left:-60upx;">首页</view>
				<view></view>
				<view class="iconfont icon-shouye-shouye" style="font-size: 28rpx; margin-top:6upx;margin-right:-60upx">
					{{userName}}
				</view>
			</view>
			<view class="topSty" v-if="isShow">
				<view class="navList" v-for="(item,index) in navList" :key="index" @click="skipClassFun(item)">
					{{item.classDeptName}}
				</view>
			</view>
			<!-- <view class="title">
					<view class="navList" v-for="(item,index) in navList" :key="index">
						{{item.classDeptName}}
					</view>
				</view> -->
		</view>
		<!-- #endif -->



		<!-- #ifdef MP -->
		<view>
			<view class="box-bg">

			</view>
			<view class="nav_wrap" v-if="userName!=''">
				<view v-if="userName!==''" class="iconfont icon-zuojiantou"
					style="color:white;font-size: 54rpx; position: absolute; top: 140rpx; left: 3%;" @click="getBack()">
				</view>
				<view v-else class="iconfont icon-shouye-shouye"
					style="color:white;font-size: 32upx; position: absolute; top: 140rpx; left: 3%;">
				</view>

				<!-- #ifdef APP-PLUS  -->
				<view v-if="userName!=''" class="iconfont icon-zuojiantou" style="color:#0000EE;font-size: 36rpx;">
				</view>
				<view v-else class=" iconfont icon-shouye-shouye" style="color:white;font-size: 32upx;">
				</view>
				<!--#endif -->

				<view class="topIndexFlex">
					<view class="iconfont icon-shouye-shouye"
						style="font-size: 38rpx;margin-right:50rpx;margin-left: 60rpx;" v-if="topName=='首页'"></view>
					{{topName}}
				</view>
				<!-- 班级 -->
				<view @click="skipFun()" style="font-size: 28rpx; margin-left: 560rpx;"
					v-if="classId&&roleName=='部门经理'">
					{{titleFont}}
					<span class="iconfont icon-xiajiantou" style="font-size: 28rpx;"></span>
				</view>
				<!-- 宿舍 -->
				<view @click="skipFun()" v-else-if="buildingNo&&(userName=='宿管老师'||userName=='部门经理'||userName=='超级管理员')"
					style="font-size: 28rpx; margin-left: 560rpx; position: relative; top: 48rpx;">{{buildFont}}
					<span class="iconfont icon-xiajiantou" style="font-size: 28rpx;"></span>
				</view>
				<!-- 其他 -->
				<view @click="skipFun()" v-else style="font-size: 28rpx;margin-left: 560rpx;">
					<view style="position: relative; top: 37rpx;">
						<span>{{userName}}</span>
						<span class="iconfont icon-xiajiantou" style="font-size: 28rpx;"></span>
					</view>
				</view>
				<!-- <view class="logout"></view> -->
				<!-- <text  >退出</text> -->
			</view>
			<view v-else class="nav_wrap">
				<view style="color:white;font-size: 38rpx;margin-left:-60upx;">首页</view>
				<view></view>
				<view class="iconfont icon-shouye-shouye" style="font-size: 28rpx; margin-top:6upx;margin-right:-60upx">
					{{userName}}
				</view>
			</view>
			<view class="topSty" v-if="isShow">
				<view class="navList" v-for="(item,index) in navList" :key="index" @click="skipClassFun(item)">
					{{item.classDeptName}}
				</view>
			</view>
			<!-- <view class="title">
					<view class="navList" v-for="(item,index) in navList" :key="index">
						{{item.classDeptName}}
					</view>
				</view> -->
		</view>
		<!-- #endif -->



	</view>


</template>

<script>
	export default {
		name: "topCom",
		props: {
			userName: String,
			topName: String,
			buildingNo: String,
			classDeptId: String,
			type: String,
			url: String
		},
		data() {
			return {
				buildFont: '畔湖苑',
				roleName: '',
				classId: '',
				navList: [{
					title: "启蒙星",
					path: ""
				}, {
					title: "BCSP",
					path: ""
				}, {
					title: "实训",
					path: ""
				}, {
					title: "课工场",
					path: ""
				}, ],
				buildNoList: [{
						classDeptName: "畔湖苑",
						path: "1"
					}, {
						classDeptName: "明志楼",
						path: "2"
					},
					{
						classDeptName: "听湖苑",
						path: "2"
					}, {
						classDeptName: "退出",
						path: "2"
					}
				],
				isShow: false,
				titleFont: '启蒙星',
				isDuty: 0,
				platform: "",
			}
		},
		methods: {
			logout() {
				uni.showModal({
					content: '确认退出?',
					title: '提示',
					success: (res) => {
						// console.log(res);
						if (res.confirm) {
							uni.reLaunch({
								url: '/pages/index/login'
							})
							return;
						}

					}
				})
			},
			skipFun() {
				if (this.classDeptId || this.buildingNo) {
					this.isShow = !this.isShow
				} else {
					uni.showModal({
						title: '确认退出?',
						success: (res) => {
							// console.log(res);
							if (res.confirm) {
								uni.reLaunch({
									url: '/pages/index/login'
								})
								return;
							}

						}
					})
				}

			},
			skipClassFun(item) {
				if (item.classDeptName == '退出') {

					uni.reLaunch({
						url: '/pages/index/login'
					})
					return;
				}
				if (this.classDeptId) {
					uni.navigateTo({
						url: `/pages/classManagement/classManagementAttendance?classDeptId=${item.classDeptValue}`,
						success: res => {},
						fail: () => {},
						complete: () => {}
					});
				} else {
					var type = this.type
					if (type == '考勤') {
						console.log("执行了考勤的")
						uni.navigateTo({
							url: `/pages/classManagement/classManagementDormitoryAttendance?buildingNo=${item.classDeptName}&type=${type}`
						})
					} else if (type == '卫生') {
						uni.getStorage({
							key: 'isDuty',
							success: (res) => {
								this.isDuty = res.data
							}
						})
						this.isDuty = uni.getStorageSync("isDuty")
						if (this.isDuty == 1) {
							uni.navigateTo({
								url: `/pages/dutyCheckWorkAttendance/dutyDorList?buildingNo=${item.classDeptName}&type=${type}`
							})
						} else {
							uni.navigateTo({
								url: `/pages/classManagement/classManageDormitoryHealth?buildingNo=${item.classDeptName}&type=${type}`
							})
						}

					} else {
						uni.navigateTo({
							url: `/pages/maintenance/dormitoryMaintenanceList?buildingNo=${item.classDeptName}&type=${type}`
						})
					}

				}
			},
			getBack() {
				console.log(this.url)
				var userName = uni.getStorageSync("userName");
				// if (this.url != undefined && userName != '战鹰') {
				if (this.url) {
					console.log("执行到这里了")
					uni.navigateTo({
						url: this.url
					})
				} else {
					let canNavBack = getCurrentPages();
					if (canNavBack && canNavBack.length > 1) {
						uni.navigateBack({
							delta: 1
						});
					} else {
						history.back();
					}
				}
			},
			classDep() {
				this.$api.classManage.getAppClassDept().then(res => {
					this.navList = res.data
					this.navList.forEach((item, index) => {
						if (item.classDeptValue == this.classId) {
							this.titleFont = item.classDeptName
						}
					})
				})
			},
			build() {
				this.navList.forEach((item) => {
					if (item.classDeptName == this.buildingNo) {
						this.buildFont = item.classDeptName
					}
				})
			},


		},
		created() {
			var that = this
			that.classId = that.classDeptId
			let routes = getCurrentPages(); // 获取当前打开过的页面路由数组
			let curRoute = routes[routes.length - 1].route //获取当前页面路由
			let curParam = routes[routes.length - 1].options; //获取路由参数
			uni.getStorage({
				key: "userInfo",
				success: function(res) {
					that.roleName = res.data
				},
				fail: (res) => {}
			})
			// console.log(this.userName,this.$props,"userName")
			// uni.getStorage({
			// 	key:"loginName",
			// 	success:function(res){
			// 		that.userName = res.data

			// 	},
			// 	fail:(res)=>{

			// 	}  
			// })


			// console.log(that.roleName,that.userName,"roleName222")
			if (this.classId) {
				this.classDep()
				// this.buildingNo = null
			} else {
				this.navList = this.buildNoList
				this.build()
			}
		},

	}
</script>

<style>
	.box-bg {
		background-color: #0100cc;
		padding: 60rpx 0;
	}

	.topSty {
		background-color: #0000EE;
		width: 155rpx;
		/* height:190rpx; */
		position: absolute;
		top: 200rpx;
		left: 570rpx;
		z-index: 999999 !important;
		border-radius: 10rpx;
		text-align: center;
	}

	.navList {
		color: white;
		width: 150rpx;
		height: 45rpx;
		font-size: 32rpx;
		line-height: 30rpx;
		margin-top: 3rpx;
		/* padding-left:13rpx; */
		padding-top: 5rpx;
	}

	.topIndexFlex {
		font-weight: 800;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-top: -90upx;
		font-size: 42rpx;
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
		top: 228rpx;
	}

	.nav_wrap {
		width: 750upx;
		height: 125upx;
		text-align: center;
		color: #fff;
		font-size: 36upx;
		/*  #ifndef  MP-WEIXIN */
		margin-top: 60rpx;
		/*  #endif  */
		display: flex;
		justify-content: space-around;
		font-size: 38rpx;

	}

	.topNavFont {
		position: fixed;
		top: 100upx;
		right: 26upx;
		z-index: 999;
		color: white;
		font-size: 42rpx;
	}

	.topComSty {
		width: 100%;
		height: 300rpx;
		background-image: url(https://tj-1305380059.cos.ap-nanjing.myqcloud.com/pic/t-1.png);
		background-repeat: no-repeat;
		background-size: 100% 100%;
		background-color: blue;
	}
</style>